<template>
  <el-dialog
    title="纪委组管理部门"
    :visible.sync="dialog"
    width="700px"
    @close="$emit('update:visible', false)"
  >
    <div>
      <el-form
        :model="form"
        ref="DIForm"
        :rules="rules"
        label-width="100px"
        :inline="false"
        size="normal"
      >
        <el-form-item label="当前纪检组">
          <el-select
            style="width: 500px"
            v-model="currentPID"
            size="normal"
            disabled
          >
            <el-option
              v-for="(item, index) in parentDept"
              :key="index"
              :label="item.dept_name"
              :value="item.dept_id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="监管部门" prop="dept_id">
          <DeptCascader
            :options="deptTree"
            :defaultChecked="form.dept_id"
            @change="changeDept"
          ></DeptCascader>
        </el-form-item>
      </el-form>
    </div>
    <span slot="footer">
      <!-- <el-button @click="$emit('update:visible', false)">取消</el-button> -->
      <el-button @click="dialog = false">取消</el-button>
      <el-button type="primary" @click="saveDI">保存</el-button>
    </span>
  </el-dialog>
</template>

<script>
import DeptCascader from "@/components/Common/DeptCascader.vue";
import { postDIInfo } from "@/api/System/DITeam";
import { required } from "@/utils/eValidate";
export default {
  components: { DeptCascader },
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    parentDept: {
      type: Array,
      default: [],
    },
    currentPID: {
      type: String,
      default: "",
    },
    deptTree: {
      type: Array,
      default: [],
    },
    currentCID: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      form: {
        id: "",
        dept_id: "",
        supervise_dept_id: "",
      },
      rules: {
        dept_id: [required],
      },
    };
  },
  methods: {
    saveDI() {
      this.$refs.DIForm.validate((valid) => {
        if (valid) {
          postDIInfo(this.form).then((res) => {
            if (res.code == 0) {
              this.$set(this.form, "dept_id", "");
              this.$message.success("监管部门更新成功");
              this.$emit("update:visible", false);
              this.$emit("refresh");
            }
          });
        }
      });
    },
    changeDept(val) {
      this.form.dept_id = val.value;
    },
  },
  computed: {
    dialog: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("update:visible", val);
      },
    },
  },
  watch: {
    currentPID(newVal, oldVal) {
      this.form.supervise_dept_id = newVal;
    },
  },
};
</script>

<style>
</style>